.f_r{
  float: right;
}
.f_l{
  float: left;
}
.clearfix:after{
  content: '';
  height: 0;
  line-height: 0;
  display: block;
  visibility: hidden;
  clear: both;
}
.clearfix{
  zoom: 1;/*兼容IE游览器*/
}
.add_roll{
  width: 100%;
  height: calc(100% + 102px);
  position: fixed;
  left: 0;
  top: -102px;
  background-color: rgba(0,0,0,.65);
  padding-top: 188px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99;
}
.add_roll::-webkit-scrollbar{
  width: 5px;
  height: 5px;
  background-color: #666666;
}
.add_roll ::-webkit-scrollbar-thumb{
  background-color: #E86B99;
}
.add_roll p{
  margin: 0;
}
.add_roll .add_roll_container{
  width: 479px;
  max-height: 688px;
  height: calc(100% + 52px);
  background-color: #fff;
  padding: 32px;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  margin-top: -100px;
  overflow: auto;
}
.little_title{
  font-size: 14px;
  color: #333333;
  font-weight: 700;
}
.title{
  text-align: center;
  font-size: 22px;
  color: #333333;
  font-weight: 700;
  margin: 0;
}
.upload_cover{
  width: 200px;
  height: 280px;
  display: inline-block;
}
.add_cover{
  width: 415px;
  height: 281px;
}
.add-cover{
  width: 198px;
  background: #999999;
  border: 1px solid #DDDDDD;
  height: 260px;
  text-align: center;
  box-sizing: border-box;
  cursor: pointer;
  position: relative;
  background-size: cover;
  display: inline-block;
}
.add-cover input[type="file"]{
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  cursor: pointer;
  display: inline-block;
  z-index: 200;
}
.add-cover .add-cover-icon {
  margin-top: 95px;
}
.add-cover .support{
  margin-top: 20px;
  color: white;
  font-size: 14px;
}
.add-cover-tips{
  color: white;;
  font-size: 14px;
}
.default_cover{
  width: 202px;
  height: 253px;
  margin-top: 28px;
}
.default_cover .default_cover_div {
 width: 97px;
  height: 124px;
  cursor: pointer;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center;
  display: inline-block;
  position: relative;
}
.default_cover .default_cover_div .cover_select{
  position: absolute;
  right: 0;
  top: -4px;
}
.default_cover .default_cover_div:nth-of-type(odd){
  margin-right: 5px;
}
.default_cover .default_cover_div:nth-child(-n+2){
  margin-bottom: 5px;
}
.gray {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
}
/*变灰只支持CSS3*/
.add_roll_name{
  margin-top: 15px;
  margin-bottom: 18px;
}
.add_roll_name p span{
  font-size: 12px;
  color: #999999;
  display: inline-block;
  margin-left: 4px;
}
.add_roll_end_time{
  margin-bottom: 18px;
}
.add_code{
  margin-bottom: 28px;
  position: relative;
}
.code_icon{
  height: 40px;
  width: 35px;
  text-align: center;
  border-color: rgb(153,153,153);
  position: absolute;
  top: 20px;
  padding-top: 8px;
  padding-right: 9px;
  padding-left: 10px;
  right:0;
  z-index: 999;
  cursor: pointer;
}
.close{
  width: 14px;
  height: 28px;
  text-align: center;
  cursor: pointer;
  font-size: 24px;
  font-weight: bold;
  position: relative;
  top: -32px;
  right: -10px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button{
  -webkit-appearance: none !important;
  margin: 0;
}
/*修改input提示文字*/
::-webkit-input-placeholder {
  color: white;
}

:-moz-placeholder {
  color: white;
}

::-moz-placeholder {
  color: white;
}

:-ms-input-placeholder {
  color: white;
}
.loading{
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 42%;
  top: 38%;
}
.upload_btn{
  width: 413px;height: 40px;line-height: 40px;text-align: center;background-color:#e86b99;font-size: 16px;letter-spacing:10px;
  cursor: pointer;
  color: #FFFFFF;
  border-radius: 6px;
}
.upload_btn:hover{
  background-color: #f697b5;
}
@media screen and (max-height: 706px){
  .add_roll .add_roll_container{
    border-radius: 0;
  }
}

